<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

  <script>

    // 1.顺序执行
    var num1 = 10
    var num2 = 20

    var result = num1 + num2
    var result2 = num1 * num2

    // 2.分支语句
    var isLogin = true
    if (isLogin) {
      console.log("访问购物车")
      console.log("访问个人中心")
    } else {
      console.log("跳转到登录页面")
    }

    // 3.循环语句
    var i = 0;
    while (i < 10) {
      console.log("执行循环语句")
      i++
    }

    // 一个代码块
    {
      var num1 = 10
      var num2 = 20
      var result = num1 + num2
    }

    // 一个对象
    var info = {
      name: "Lily",
      age: 18
    }

    // 案例一: 如果小明考试超过90分, 就可以去游乐场
    // 1.定义一个变量来保存小明的分数
    var score = 99

    // 2.如果分数超过90分, 去游乐场
    if (score > 90) {
      console.log("去游乐场玩~")
    }


    // 案例二: 苹果单价5元/斤, 如果购买的数量超过5斤, 那么立减8元
    // 1.定义一些变量保存数据
    var price = 5
    var weight = 7
    var totalPrice = price * weight

    // 2.根据购买的重量, 决定是否 -8
    if (weight > 5) {
      totalPrice -= 8
    }

    console.log("总价格:", totalPrice)


    // 案例三: 播放列表中 currentIndex
    // ["鼓楼", "理想", "阿刁"]
    var currentIndex = 2

    // 对currentIndex++完操作之后
    currentIndex++
    if (currentIndex === 3) {
      currentIndex = 0
    }

    // 补充一: 如果if语句对应的代码块, 只有一行代码, 那么{}可以省略
    // 案例二: 苹果单价5元/斤, 如果购买的数量超过5斤, 那么立减8元
    // 定义一些变量保存数据
    var price = 5
    var weight = 7
    var totalPrice = price * weight

    // 2.根据购买的重量, 决定是否 -8
    if (weight > 5) totalPrice -= 8

    console.log("总价格:", totalPrice)

    // 补充二: if (条件判断)
    var num = 123 // true
    if (num) {
      console.log("num判断的代码执行")
    }

    // if-else
    var score = 80
    // 条件成立, 专属的代码块
    // 条件不成立, 专属的代码块
    // if (score > 90) {
    //   console.log("去游乐场玩~")
    // } else {
    //   console.log("哈哈哈哈")
    // }

    // 案例一: 小明超过90分去游乐场, 否则去上补习班
    if (score > 90) {
      console.log("去游乐场玩~")
    } else {
      console.log("去上补习班~")
    }

    // 案例二: 有两个数字, 进行比较, 获取较大的数字
    var num1 = 12 * 6 + 7 * 8 + 7 ** 4
    var num2 = 67 * 5 + 24 ** 2
    console.log(num1, num2)

    var result = 0
    if (num1 > num2) {
      result = num1
    } else {
      result = num2
    }
    console.log('result:', result)

    // if-elseif-else
    // 案例: score评级
    // 1.获取用户输入的分数
    var score = prompt("请输入您的分数:")
    score = Number(score)

    // 2.判断等级
    // 使用if else的方式来实现
    // if (score > 90) {
    //   alert("您的评级是优秀!")
    // } else {
    //   if (score > 80) {
    //     alert("您的评级是良好!")
    //   } else {
    //   }
    // }

    // edge case
    // if (score > 100 || score < 0) {
    //   alert("您输入的分数超过了正常范围")
    // } 

    if (score > 90) {
      alert("您的评级是优秀!")
    } else if (score > 80) {
      alert("您的评级是良好!")
    } else if (score >= 60) {
      alert("您的评级是合格!")
    } else {
      alert("不及格!!!")
    }
    // 三元运算符
    // 案例一: 比较两个数字
    var num1 = 12 * 6 + 7 * 8 + 7 ** 4
    var num2 = 67 * 5 + 24 ** 2

    // 三元运算符
    var result = num1 > num2 ? num1 : num2
    console.log(result)

    // 案例二: 给变量赋值一个默认值(了解)
    var info = {
      name: "Lily"
    }
    var obj = info ? info : {}
    console.log(obj)

    // 案例三: 让用户输入一个年龄, 判断是否成年人
    var age = prompt("请输入您的年龄:")
    age = Number(age)
    // if (age >= 18) {
    //   alert("成年人")
    // } else {
    //   alert("未成年人")
    // }
    var message = age >= 18 ? "成年人" : "未成年人"
    alert(message)


    // switch语句
    // 语法
    // switch (表达式/变量) {
    //   case 常量1:
    //     // 语句
    // }


    // 案例:
    // 上一首的按钮: 0
    // 播放/暂停的按钮: 1
    // 下一首的按钮: 2
    // var btnIndex = 100
    // if (btnIndex === 0) {
    //   console.log("点击了上一首")
    // } else if (btnIndex === 1) {
    //   console.log("点击了播放/暂停")
    // } else if (btnIndex === 2) {
    //   console.log("点击了下一首")
    // } else {
    //   console.log("当前按钮的索引有问题~")
    // }

    var btnIndex = 0
    switch (btnIndex) {
      case 0:
        console.log("点击了上一首")
        break
      case 1:
        console.log("点击了播放/暂停")
        // 默认情况下是有case穿透
        break
      case 2:
        console.log("点击了下一首停")
        break
      default:
        console.log("当前按钮的索引有问题~")
        break
    }

  </script>

</body>

</html>